import { ref } from 'vue'
import { ElMessage } from 'element-plus'

export function useTag() {
  const isTagEdit = ref(false)
  const tagText = ref('')
  const tags = ref([])

  // 添加工作标签
  const addTag = () => {
    if (!tagText.value || tags.value.includes(tagText.value))
      return ElMessage({
        message: '该项已存在，无需重复添加！',
        type: 'warning'
      })
    tags.value.push(tagText.value)
    tagText.value = ''
    isTagEdit.value = false
  }

  // 删除对应的标签
  const deleteTag = index => {
    tags.value = tags.value.filter((item, idx) => idx !== index)
  }

  // 取消保存的标签
  const cancelTag = () => {
    tagText.value = ''
    isTagEdit.value = false
  }

  return {
    tagText,
    isTagEdit,
    tags,
    addTag,
    deleteTag,
    cancelTag
  }
}
